import 'package:flutter/material.dart';
import 'package:flutter_axrjc/style.dart';
import 'package:flutter_axrjc/widget/custom_text_field.dart';
import 'package:get/get.dart';

import 'logic.dart';

class ChangePasswordPage extends StatelessWidget {
  const ChangePasswordPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final logic = Get.find<ChangePasswordLogic>();
    final state = Get.find<ChangePasswordLogic>().state;

    return Scaffold(
      backgroundColor: const Color(0xffF3F6F9),
      appBar: AppBar(
        backgroundColor: Colors.white,
        foregroundColor: Colors.black,
        titleSpacing: -10,
        elevation: 0,
        centerTitle: true,
        title: const Text(
          "个人信息",
          style: TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
        ),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const SizedBox(
            height: 20,
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
            child: Obx(() {
              return Text(
                "收信手机号：${state.phone.value}",
                style: const TextStyle(color: Colors.grey),
              );
            }),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 25),
            child: Column(
              children: [
                Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    const Padding(
                      padding: EdgeInsets.all(8.0),
                      child: Text("验证码"),
                    ),
                    Expanded(
                      child: Obx(() {
                        return CustomTextField(
                          value: state.yzm.value,
                          onChanged: (text) {
                            state.yzm.value = text;
                          },
                          inputDecoration: const InputDecoration(
                              hintStyle:
                                  TextStyle(fontSize: 14, color: Colors.grey),
                              contentPadding: EdgeInsets.symmetric(vertical: 5),
                              hintText: "请输入验证码",
                              isDense: true,
                              isCollapsed: true,
                              border: InputBorder.none),
                        );
                      }),
                    ),
                    InkWell(
                      onTap: logic.sendSmsCode,
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Obx(() {
                          return Text(
                            state.buttonText.value,
                            style: const TextStyle(
                                fontSize: 12, color: orangeColor),
                          );
                        }),
                      ),
                    )
                  ],
                ),
                Divider(
                  color: Colors.grey.shade300,
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20),
            child: Column(
              children: [
                Row(
                  children: [
                    const Padding(
                      padding: EdgeInsets.all(8.0),
                      child: Text("新密码"),
                    ),
                    Expanded(
                      child: Obx(() {
                        return CustomTextField(
                          obscureText: true,
                          maxLines: 1,
                          value: state.password.value,
                          onChanged: (text) {
                            state.password.value = text;
                          },
                          inputDecoration: const InputDecoration(
                              contentPadding: EdgeInsets.symmetric(vertical: 5),
                              hintText: "6-12位字母数字组合",
                              hintStyle:
                                  TextStyle(fontSize: 14, color: Colors.grey),
                              isDense: true,
                              isCollapsed: true,
                              border: InputBorder.none),
                        );
                      }),
                    ),
                  ],
                ),
                Divider(
                  color: Colors.grey.withAlpha(50),
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20),
            child: Column(
              children: [
                Row(
                  children: [
                    const Padding(
                      padding: EdgeInsets.all(8.0),
                      child: Text("确认新密码"),
                    ),
                    Expanded(
                      child: Obx(() {
                        return CustomTextField(
                          obscureText: true,
                          maxLines: 1,
                          value: state.password2.value,
                          onChanged: (text) {
                            state.password2.value = text;
                          },
                          inputDecoration: const InputDecoration(
                              contentPadding: EdgeInsets.symmetric(vertical: 5),
                              hintText: "请再次输入新密码",
                              hintStyle:
                                  TextStyle(fontSize: 14, color: Colors.grey),
                              isDense: true,
                              isCollapsed: true,
                              border: InputBorder.none),
                        );
                      }),
                    ),
                  ],
                ),
                Divider(
                  color: Colors.grey.withAlpha(50),
                ),
              ],
            ),
          ),
          const SizedBox(
            height: 20,
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: InkWell(
              onTap: logic.change,
              child: Container(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                      color: const Color(0xffDCDCDC).withAlpha(102),
                      borderRadius: BorderRadius.circular(20)),
                  child: const Center(
                    child: Text(
                      "修改密码",
                      style: TextStyle(color: Colors.orange, fontSize: 14),
                    ),
                  )),
            ),
          ),
        ],
      ),
    );
  }
}
